/**
 * Created by King_S on 2017/8/16/0016.
 */

var vms = new Vue({
    el:"#app",
    data:{
        totalMoney:0,
        productList:[],
        checkAllFlag:false,
        delFlag:false,
        curProduct:'',
    },
    filters:{
        formatMoney: function (val) {
            return "￥"+val.toFixed(2);
        }
    },
    mounted:function () {
        this.$nextTick(function () {
            // vms.cartView()
            this.cartView();
        });
    },
    methods:{
        cartView: function () {

            var _this = this;

            // vms.$http.get("data/cartData.json",{"id":123}).then(function (res) {
            //     _this.productList = res.body.result.list; //vue把json文件的result属性存在res.body中
            //     _this.totalMoney = res.body.result.totalMoney;
            // });

            this.$http.get("data/cartData.json",{"id":123}).then(function (res) {
                _this.productList = res.body.result.list; //vue把json文件的result属性存在res.body中
                // _this.totalMoney = res.body.result.totalMoney;
            });

        },
        changeMoney: function (product,judge) {
            if(judge>0){
                product.productQuantity++;
            }else{
                product.productQuantity>1 ? product.productQuantity-- : 1;
            }
            this.calcTotalPrice()

        },
        selectedProduct: function (item) {
            if(typeof  item.checked == "undefined"){
                // Vue.set(item, "checked",true);
                this.$set(item, "checked",true)
            }else{
                item.checked = !item.checked
            }
            // var _this = this;
            // this.productList.forEach(function (item) {
            //     if(item.checked==false){
            //         _this.checkAllFlag=false;
            //     }
            // });
            var k=0;
            this.productList.forEach(function(item,index){
                if(item.checked){
                    k++;
                }
            });
            if(k==this.productList.length){
                this.checkAllFlag=true;
            }else{
                this.checkAllFlag=false;
            }
            this.calcTotalPrice()
        },
        checkAll: function (flag) {
            this.checkAllFlag = flag;
            var _this = this;
            console.log(_this);
            this.productList.forEach(function (item, index) {
                if(typeof  item.checked == "undefined"){
                    _this.$set(item, "checked",_this.checkAllFlag)
                }else{
                    item.checked = _this.checkAllFlag;
                }

                console.log(this == _this);
            });
            this.calcTotalPrice()
        },
        calcTotalPrice: function () {
            var _this=this;
            this.totalMoney = 0;
            this.productList.forEach(function (item, index) {
              if (item.checked){
                  _this.totalMoney += item.productPrice * item.productQuantity;
              }
            })
        },
        delProduct: function () {
            var index = this.productList.indexOf(this.curProduct);
            this.productList.splice(index, 1);
            this.delFlag=false;
            this.calcTotalPrice()
        },
        delConfirm: function (item) {
            this.delFlag=true;
            this.curProduct = item;
        }
    }
});

Vue.filter('money',function (val,type) {
    return "￥"+val.toFixed(2) + type;
})


